<template>
    <div>
    <div class="recommend-title">热销推荐</div>
    <ul class="items">
      <li class="item" v-for="(item,id) of recommendlist" :key="id">
        <img class="item-img" :src="item.imgurl"/>
         <div class="item-info">
             <p class="item-title">{{item.title}}</p>
             <p class="item-des">{{item.des}}</p>
             <button class="item-button">查看详情</button>
         </div>
      </li>
    </ul>
    </div>
</template>
<script>
export default {
    name:"homerecommend",
    props:['recommendlist'],
    data () {
        return{
        }
    }
}
</script>
<style lang="stylus" scope>
@import "~styles/mixins.sty"
 .recommend-title
   margin-top:7px;
   line-height:30px;
   background:#eee;
   text-indent: 20px;
 .items
   padding:0;
   margin:0;
 .item
    display:flex;
    height:94px;
    overflow:hidden;
  .item-img
    height :85px;
    width :80px;
    padding:5px;
  .item-info
    min-width:0;
    flex:1;
   .item-title
     margin:0px
   .item-des
     ellipsis();
     line-height:35px;
     margin:0
   .item-button
    padding:0 4px;
    margin-top:9px;
</style>


